<template>
  <div>
<div class="houseitem" v-for="(item,index) in list" :key="index">
  <div class="left">
    <img :src="`http://liufusong.top:8080${item.houseImg}`" alt="">
  </div>

  <div class="right" @click="tiaozhuan(item.houseCode)">
    <p class="name">{{item.title}}</p>
    <p class="size">{{item.desc}}</p>
    <span>{{item.tags}}</span>
    <p class="price">{{item.price}}</p>
  </div>
</div>
  </div>
</template>

<script>
import {setItem} from '@/utils/storage.js'
export default {
  name: 'HaokeCollect',
  props: ['list'],
  data () {
    return {

    }
  },

  created () {

  },
  methods: {
    tiaozhuan (num) {
      console.log(num)
      setItem('houseCode', num)
      this.$router.push('/detail')
    }

  }
}
</script>

<style lang="less" scoped>
.title{
  background-color:#56b27b ;
}
/deep/ .van-nav-bar__title{
  color: #fff;
}
/deep/ .van-nav-bar__left .van-icon{
  color: #fff;
}
.houseitem{
  height: 120px;
border-bottom: 1px solid #ccc;
  display: flex;
  .left{
    margin-top: 20px;
    img{
      width: 106px;
      height: 80px;
    }
  }
  .right{
    margin-left: 13px;
    .name{
font-size: 15px;
color: #000;
font-weight: 700;
margin-top: 20px;
    }
    .size{
      color: #b0b2b3;
      font-size: 12px;
      margin-top: -10px;
    }
    span{
      background-color:#e5f4f7;
      color: #61bbca;
      font-size: 14px;
      margin-top: -10px;
    }
    .price{
      font-size: 12px;
    color: #fa5741;
    margin-top: 5px;
    }
  }
}
</style>
